<!-- 项目审批 -->
<template>
	<view >
		<cu-custom bgColor="bg-blue2" :isBack="true" @back="backedPage"><block slot="backText">返回</block><block slot="content">移库码单编辑</block></cu-custom>
		
		<view>
			<view style="margin-top: 75px;" class='cu-btn bg-blue2 lg block shadow radius margin-xl selectStack' @tap="showModal" data-target="viewModal">
				选择库存码单
			</view>
			<form  @submit="onSubmit">
				<view class="cu-form-group">
					<view class="title">原数量</view>
					<input v-model="item.qtyOriginal" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">可移数量</view>
					<input v-model="item.qtyAvailable" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">原重量</view>
					<input v-model="item.weightOriginal" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">可移重量</view>
					<input v-model="item.weightAvailable" name="input" disabled="disabled"></input>
				</view>	
				<view class="cu-form-group">
					<view class="title">原堆号</view>
					<input v-model="item.heapNumOrg" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">原层号</view>
					<input v-model="item.layerNumOrg" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">原码单号</view>
					<input v-model="item.stackNumOrg" name="input" disabled="disabled"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">新堆号</view>
					<input v-model="item.heapNumNew" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">新层号</view>
					<input v-model="item.layerNumNew" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">新码单号</view>
					<input v-model="item.stackNumNew" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title xrequired">移库数量</view>
					<input :class="item.qtyActual>0 ? '' : 'xrwaning'" v-model="item.qtyActual" name="input"></input>
				</view>
				<view class="cu-form-group">
					<view class="title xrequired">移库重量</view>
					<input :class="item.weightActual>0 ? '' : 'xrwaning'" v-model="item.weightActual" name="input"></input>
				</view>				
				<view>
					<button form-type="submit" class="cu-btn block bg-blue margin-tb-sm lg" :disabled="loading" type="">
						<text :class="loading ? 'cuIcon-loading2 cuIconfont-spin' : ''"></text>保存</button>
				</view>
			</form>
			<view class="cu-modal drawer-modal justify-start" :class="isShowStackDialog ?'show':''" @tap="hideModal">
				<view class="cu-dialog basis-lg" >
					<uni-nav-bar :fixed="true" color="#333333" background-color="#4364F7" :border="false">
						<view class="input-view">
							<uni-icons type="search" size="22" color="#666666" />
							<input v-model="searchVal" confirm-type="search" class="input" type="text" placeholder="批次" @confirm="search">
							<uni-icons :color="'#999999'" v-if="searchVal!==''" class="icon-clear" type="clear" size="22" @click="clear" />
						</view>
						<!-- <uni-search-bar style="width: 100%;" placeholder="搜索项目/机构" radius="100" clearButton="auto" @confirm="search" /> -->
					</uni-nav-bar>
					<scroll-view scroll-y="true">
						<view class="mycard">
							<view v-for="(item,index) in cardList" :key="index" class="card-item">
								<uni-card is-full title="库存码单" is-shadow note="true">
									<view class="audit-card-content">
										<view class="uni-flex uni-row">
											<view class="flex-item-30">原数量</view>
											<view class="flex-item-70">{{item.qtyOriginal}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">可移数量</view>
											<view class="flex-item-70">{{item.qtyAvailable}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">原重量</view>
											<view class="flex-item-70">{{item.weightOriginal}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">可移重量</view>
											<view class="flex-item-70">{{item.weightAvailable}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">原堆号</view>
											<view class="flex-item-70">{{item.heapNumOrg}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">原层号</view>
											<view class="flex-item-70">{{item.layerNumOrg}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">原码单号</view>
											<view class="flex-item-70">{{item.stackNumOrg}}</view>
										</view>
										<view class="uni-flex uni-row">
											<view class="flex-item-30">卷号</view>
											<view class="flex-item-70">{{item.innerBatch}}</view>
										</view>						
										<view class="uni-flex uni-row">
											<view class="flex-item-30">备注</view>
											<view class="flex-item-70">{{item.remark}}</view>
										</view>		
									</view>
					
									<template v-slot:footer>
										<view class="footer-box">
											<view class="iconfont my-iconfont text-green"></view>
											<view class="iconfont my-iconfont text-red"></view>
											<view class="cuIcon-check text-blue" @tap="selectedClick(index)">选择</view>
										</view>
									</template>
								</uni-card>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	import uniTag from '@/components/uni-tag/uni-tag.vue'
	import uniIcons from '@/components/uni-icons/uni-icons.vue'
	import uniCombox from '@/components/uni-combox/uni-combox.vue'

	import {
		mapGetters
	} from 'vuex'
	import {
		getRandomArrayElements,
		filePreview,
		formatStatus
	} from '@/utils/index.js'
	import { formatDate } from '@/utils/datetime.js'
	export default {
		components: {
			uniTag,
			uniIcons,
			uniCombox
		},
		computed: mapGetters(['user']),
		data() {
			return {
				item: { },
				goodsPosiChngBillId:0,
				detailId: 0,
				stackId:0,
				loading: false,
				isShowStackDialog: false,
				cardList: [],
				datas:[],
				searchVal: ''
			}
		},
		onLoad(options) {
			this.goodsPosiChngBillId = options.goodsPosiChngBillId
			this.detailId = options.detailId
			this.stackId = options.stackId
			if (this.detailId >0 && this.stackId > 0) {
				this.$minApi.getGoodsPosiChngStack(this.stackId).then(res => {
					const data = res
					if (data) {
						this.item = data
					}
				}).catch(err => {
					console.log(err)
				}).finally(() => {
				})
			} else {
				uni.setNavigationBarTitle({
				title: '新增移库码单'
				})
			}
			
			const params = {
				billId: this.goodsPosiChngBillId,
				detailId: this.detailId
			  }
			this.$minApi.getGoodsPosiChngStockList(params).then(res => {

				const data = res
				if (data) {					
					this.cardList = data
					this.datas = data
				}
			}).catch(err => {
				console.log(err)
			}).finally(() => {
			
			})
		},
		methods: {
			filePreview,
			formatStatus,
			formatDate,
			onSubmit(e) {  
				
				if(!this.item.qtyActual
					|| !this.item.weightActual) {
					uni.showToast({
						icon: 'none',
					    title: '必填项未填写',
					    duration: 2000
					})
					return
				}
				
				if(this.item.qtyActual<=0
					|| this.item.weightActual<=0) {
					uni.showToast({
						icon: 'none',
					    title: '移库数量或重量必须大于0',
					    duration: 2000
					})
					return
				}
				
				if(!this.item.qtyOriginal) {
					uni.showToast({
						icon: 'none',
					    title: '需选择库存码单',
					    duration: 2000
					})
					return
				}
				
				this.loading = true
				const _this = this
				
				this.item.qtyOriginal = Number(this.item.qtyOriginal)
				this.item.qtyAvailable = Number(this.item.qtyAvailable)
				this.item.qtyActual = Number(this.item.qtyActual)
				this.item.weightOriginal = Number(this.item.weightOriginal)
				this.item.weightAvailable = Number(this.item.weightAvailable)
				this.item.weightActual = Number(this.item.weightActual)
				
				this.item.goodsPosiChngDetailID = Number(this.detailId)
				this.item.inStockGoodsStackID = Number(this.item.inStockGoodsStackID) // 从库存码单表带出来
				
				if (this.stackId > 0) {				
					
					_this.$minApi.updateGoodsPosiChngStack(this.item.id, this.item).then(res => {
						uni.showToast({
						    title: '修改成功',
						    duration: 2000
						})
						
						setTimeout(() => {
							uni.redirectTo({
								url: `/pages/todo/goodsPosiChngBill/stack?goodsPosiChngBillId=${this.goodsPosiChngBillId}&detailId=${this.detailId}&stackId=0`
							})
						}, 2000)

					}).catch(err => {
						uni.showToast({
							icon: 'none',
						    title: '修改失败',
						    duration: 2000
						})
						console.log(err)
					}).finally(() => {
						this.loading = false
					})
				} else {
					
					_this.$minApi.createGoodsPosiChngStack(this.item).then(res => {
						uni.showToast({
						    title: '添加成功',
						    duration: 2000
						})
						
						setTimeout(() => {
							uni.redirectTo({
								url: `/pages/todo/goodsPosiChngBill/stack?goodsPosiChngBillId=${this.goodsPosiChngBillId}&detailId=${this.detailId}&stackId=0`
							})
						}, 2000)
					}).catch(err => {
						uni.showToast({
							icon: 'none',
						    title: '添加失败',
						    duration: 2000
						})
						console.log(err)
					}).finally(() => {
						this.loading = false
					})
				}
				
			},
			showModal() {
				this.isShowStackDialog = true
			},
			viewModal(val) {
				this.isShowStackDialog = false
					
				// if (val) {
				
				// 	this.item.heapNum = val.heapNum
				// 	this.item.layerNum = val.layerNum
				// 	this.item.stackNum = val.stackNum		
				// 	this.item.spec = val.spec		
				// 	this.item.innerBatch = val.innerBatch						
				// 	this.item.inStockGoodsStack.qty = val.qty				
				// 	this.item.inStockGoodsStack.weight = val.weight							
				// 	this.item.goodsOutDetail.qty = val.inQty								
				// 	this.item.goodsOutDetail.weight = val.inWeight								
				// 	this.item.qty = 0	
				// 	this.item.weight = 0	
					
				// }
				
			},
			hideModal(e) {
				this.isShowStackDialog = false
			},
			selectedClick(index) {
				const val = this.cardList[index]
	
				this.isShowStackDialog = false
				if (val) {
					
					this.item.inStockGoodsStackID = val.inStockGoodsStackID		
					this.item.qtyOriginal = val.qtyOriginal
					this.item.qtyAvailable = val.qtyAvailable
					this.item.qtyActual = val.qtyActual
					this.item.weightOriginal = val.weightOriginal
					this.item.weightAvailable = val.weightAvailable
					this.item.weightActual = val.weightActual
					this.item.heapNumOrg = val.heapNumOrg					
					this.item.heapNumNew = val.heapNumNew
					this.item.layerNumOrg = val.layerNumOrg
					this.item.layerNumNew = val.layerNumNew
					this.item.stackNumOrg = val.stackNumOrg	
					this.item.stackNumNew = val.stackNumNew		
					
				}
			},
			search() {
				if (this.searchVal) {
					this.cardList = this.datas.filter(f => f.innerBatch === this.searchVal)
				} else {
					this.cardList = this.datas
				}				
			},
			clear() {
				this.searchVal = ''
				this.search()
			},
			backedPage() {
				uni.redirectTo({
					url: `/pages/todo/goodsPosiChngBill/stack?goodsPosiChngBillId=${this.goodsPosiChngBillId}&detailId=${this.detailId}&stackId=0`
				})
			}
		}
	}
</script>

<style scoped>
	.selectStack {
		position: fixed;
		top: 25px;
		right: 2px;
		z-index: 9;
	}
	.xrequired::after  {
			content: '*';
			color: red;
		}
		.xrwaning{
			border: 1px solid #FF0000;
		}
</style>
